<template>
  <div>
    <a-menu v-model:selectedKeys="current" mode="horizontal" theme="dark">
      <a-menu-item key="app" disabled>
        <template #icon>
          <home-outlined />
        </template>
        {{this.appName}}
      </a-menu-item>
<!--      <a-menu-item key="base" @click="changeMenu">
        基础数据
      </a-menu-item>-->
      <a-menu-item key="form" @click="changeMenu('form')">
        表单管理
      </a-menu-item>
<!--      <a-menu-item key="report">
        报表设置
      </a-menu-item>-->
      <a-menu-item key="menu" @click="changeMenu('menu')">
        菜单设置
      </a-menu-item>

    </a-menu>
    <router-view></router-view>
  </div>
</template>

<script>
import {AppDefinitionApi} from "@/components/home/lowCode/appDef/js/AppDefinitionApi";
import {AppFormApi} from "@/components/home/lowCode/appDef/js/AppFormApi";
import {ref} from "vue";

export default {
  name: "AppDefinition",
  mixins: [AppDefinitionApi],
  setup() {
    const current = ref(['form']);
    return {
      current,
    };
  },
  data() {
    return {
      formList: [],
      currentFormId: '',
      mainFields: [],
      loading: false,
      visible: false,
      labelCol: {span: 4},
      wrapperCol: {span: 20},
      appId: '',
      appName:'',
      appForm: {
        appId: '',
        formName: '',
      }
    }
  },
  created() {
    this.appId = this.$route.query.appId;
    this.getAppInfo();
    this.loadFormData();
    let routeUrl = this.$router.resolve({
      path: "/form/manager",
      query: {appId: this.appId,appName: this.appName}
    });
    this.$router.push(routeUrl);
  },
  methods: {
    callback(key) {
      console.log(key);
      this.loadFormData();
    },
    loadFormData() {
      AppFormApi.getByAppId(this.appId).then((data) => {
        this.formList = data;
      })
    },
    getAppInfo(){
      this.get(this.appId).then((data) => {
        this.appName = data.name;
      })
    },
    changeMenu(key){
      if(key === 'menu'){
        let routeUrl = this.$router.resolve({
          path: "/menu/manager",
          query: {appId: this.appId}
        });
        this.$router.push(routeUrl);
      }else if(key === 'form'){
        let routeUrl = this.$router.resolve({
          path: "/form/manager",
          query: {appId: this.appId,appName: this.appName}
        });
        this.$router.push(routeUrl);
      }
    }
  }
}
</script>

<style scoped>
</style>
